<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../util/bootstrap-3.3.7-dist/css/bootstrap.css">
    <link rel="stylesheet" href="../fonts/font-awesome-4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="../css/reset.css">
    <link rel="stylesheet" href="../css/ClassInformation.css">
    <link rel="stylesheet" href="../css/modalFrame-ClassInformation.css">
</head>
<body>
     <div>
         <header class="header-page">
             <div class="header-text">
                 <span>班级信息</span>
             </div>
         </header>
         <div class="content container-fluid">
             <div class="content-header">
                 <span class="content-span"><i class="fa fa-list-alt" aria-hidden="true"></i></span>
                 <span class="content-span">班级信息表</span>
                 <span class="search">
                     <input class="form-control content-input" type="text" placeholder="班级序号">
                     <span class="content-search" id="searchFor">
                         <i class="fa fa-search content-search" aria-hidden="true"></i>
                     </span>
                 </span>
                 <button type="button" class="btn btn-lg  content-btn" data-toggle="modal" data-target="#myModal" id="addClass">
                     <span>添加班级</span>
                 </button>
             </div>
             <form class="form-inline">
                 <table class="content-table">
                     <tr class="table-tr">
                         <th class="content-th list-th">
                             <span>选择</span>
                         </th>
                         <th class="content-th">序号</th>
                         <th class="content-th">班级</th>
                         <th class="content-th width-th">任职老师</th>
                         <th class="content-th width-th">任职老师</th>
                         <th class="content-th width-th">任职老师</th>
                         <th class="content-th width-th">生活老师</th>
                         <th class="content-th width-th">班级人数</th>
                         <th class="content-th width-th">教室</th>
                         <th class="content-th">开学时间</th>
                         <th class="content-th last-th">操作</th>
                         <th class="content-th time-th">备注</th>
                     </tr>
                     <tbody id="content-tbody"></tbody>
                 </table>
             </form>
         </div>
         <footer>
             <div class="footer container-fluid">
                 <button type="button" class="btn  footer-button btn-gr" id="check-all">全选</button>
                 <button type="button" class="btn  footer-button btn-bl" id="select-invert">反选</button>
                 <button type="button" class="btn  footer-button btn-ye" data-toggle="modal" data-target="#Modal-q" id="cut-out">
                     <span>删除</span>
                 </button>
                 <nav aria-label="Page navigation" class="footer-nav">
                     <ul class="pagination nav-ul" id="nav-num"></ul>
                 </nav>
             </div>
         </footer>
         <div>
             <div class="modal fade" id="Modal-q" tabindex="-1" >
                 <div class="modal-dialog modal-sm">
                     <div class="modal-content">
                         <div class="modal-header">
                             <button type="button" class="close" data-dismiss="modal" ><span >&times;</span></button>
                             <h4 class="modal-title modal-text" >操作提示框</h4>
                         </div>
                         <div class="modal-body modal-text modal-cn" >
                             <span id="modal-text">确认删除吗？</span>
                         </div>
                         <div class="modal-footer">
                             <button type="button" class="btn btn-default modal-text" data-dismiss="modal">取消</button>
                             <button type="button" class="btn btn-primary modal-text" data-dismiss="modal" id="modal-keep">是的确认删除！</button>
                         </div>
                     </div>
                 </div>
             </div>
             <div  id="revise-modal">
                 <div class="modal-dialog modal-lg" role="document">
                     <div class="modal-content">
                         <div class="modal-header">
                             <button type="button" class="close cBtn" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                             <h4 class="modal-title modal-title-font" >修改班级信息</h4>
                         </div>
                         <div class="modal-body">
                             <div class="class-modal">
                                 <div class="modal-photo">
                                     <span><img src="../images/sxl-img/w.jfif" alt="Class-photos" class="res-photo" id="revise-photo"><i class="fa fa-file-image-o re-photo" aria-hidden="true" title="选择图片"></i><input type="file" class="re-file" id="file-photo" multiple></span>
                                     <span class="re-hold-photo" id="hold-photo"><i class="fa fa-floppy-o" aria-hidden="true" title="保存并浏览"></i></span>
                                     <div class="photo-text"><span>选择图片</span></div>
                                     <div class="photo-text-two"><span>保存并浏览</span></div>
                                 </div>
                                 <ul class="content-ul">
                                     <li class="content-li">
                                         <span>班级序号：</span>
                                         <input type="text" class="contentText" id="className" placeholder="请输入4位数字">
                                     </li>
                                     <li class="content-li">
                                         <span>班级信息：</span>
                                         <input type="text" class="contentText" id="aclass" placeholder="请输入班级信息">
                                     </li>
                                     <li class="content-li">
                                         <span>任课老师：</span>
                                         <input type="text" class="contentText" id="a-teacher" placeholder="请输入任课老师">
                                     </li>
                                     <li class="content-li">
                                         <span>任课老师：</span>
                                         <input type="text" class="contentText" id="b-teacher" placeholder="请输入任课老师">
                                     </li>
                                     <li class="content-li">
                                         <span>任课老师：</span>
                                         <input type="text" class="contentText" id="c-teacher" placeholder="请输入任课老师">
                                     </li>
                                     <li class="content-li">
                                         <span>生活老师：</span>
                                         <input type="text" class="contentText" id="life-teacher" placeholder="请输入生活老师">
                                     </li>
                                     <li class="content-li">
                                         <span>班级人数：</span>
                                         <input type="text" class="contentText" id="classNumber" placeholder="请输入班级人数">
                                     </li>
                                     <li class="content-li">
                                         <span>班级教室：</span>
                                         <input type="text" class="contentText" id="classRoom" placeholder="请输入班级教室">
                                     </li>
                                     <li class="content-li">
                                         <span>开班时间：</span>
                                         <input type="text" class="contentText" id="classTime" placeholder="请输入开班时间">
                                     </li>
                                     <li class="content-li">
                                         <span>班级描述：</span>
                                         <input type="text" class="contentText" id="classDepict" placeholder="可输入11位文字" maxlength="11">
                                     </li>
                                 </ul>
                             </div>
                             <div class="footer">
                             </div>
                         </div>
                         <div class="modal-footer">
                             <button type="button" class="btn btn-default aBtn" data-dismiss="modal">取消</button>
                             <button type="button" class="btn btn-primary  modal-button bBtn">保存</button>
                         </div>
                     </div>
                 </div>
             </div>
             <div class="modal fade " id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                 <div class="modal-dialog modal-lg" role="document">
                     <div class="modal-content">
                         <div class="modal-header">
                             <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                             <h4 class="modal-title modal-title-font" id="myModalLabel">新建班级</h4>
                         </div>
                         <div class="modal-body">
                             <div class="class-modal">
                                 <div class="modal-photo">
                                     <span><img src="../images/sxl-img/w.jfif" alt="Class-photos" class="photo"><i class="fa fa-file-image-o revise-photo" aria-hidden="true" title="选择图片"></i><input type="file" class="photo-file" multiple></span>
                                     <span class="hold-photo"><i class="fa fa-floppy-o" aria-hidden="true" title="保存图片"></i></span>
                                     <div class="photo-text"><span>选择图片</span></div>
                                     <div class="photo-text-two"><span>保存并浏览</span></div>
                                 </div>
                                 <ul class="content-ul">
                                     <li class="content-li">
                                         <span>班级序号：</span>
                                         <input type="text" class="content-text" id="class-name" placeholder="请输入4位数字">
                                     </li>
                                     <li class="content-li">
                                         <span>班级信息：</span>
                                         <input type="text" class="content-text" id="class" placeholder="请输入班级信息">
                                     </li>
                                     <li class="content-li">
                                         <span>任课老师：</span>
                                         <input type="text" class="content-text" id="aTeacher" placeholder="请输入任课老师">
                                     </li>
                                     <li class="content-li">
                                         <span>任课老师：</span>
                                         <input type="text" class="content-text" id="bTeacher" placeholder="请输入任课老师">
                                     </li>
                                     <li class="content-li">
                                         <span>任课老师：</span>
                                         <input type="text" class="content-text" id="cTeacher" placeholder="请输入任课老师">
                                     </li>
                                     <li class="content-li">
                                         <span>生活老师：</span>
                                         <input type="text" class="content-text" id="lifeTeacher" placeholder="请输入生活老师">
                                     </li>
                                     <li class="content-li">
                                         <span>班级人数：</span>
                                         <input type="text" class="content-text" id="class-number" placeholder="请输入班级人数">
                                     </li>
                                     <li class="content-li">
                                         <span>班级教室：</span>
                                         <input type="text" class="content-text" id="class-room" placeholder="请输入班级教室">
                                     </li>
                                     <li class="content-li">
                                         <span>开班时间：</span>
                                         <input type="text" class="content-text" id="class-time" placeholder="请输入开班时间">
                                     </li>
                                     <li class="content-li">
                                         <span>班级描述：</span>
                                         <input type="text" class="content-text" id="class-depict" placeholder="可输入11位文字" maxlength="11">
                                     </li>
                                 </ul>
                             </div>
                             <div class="footer">
                             </div>
                         </div>
                         <div class="modal-footer">
                             <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                             <button type="button" class="btn btn-primary  modal-button" id="content-hold">保存</button>
                         </div>
                     </div>
                 </div>
             </div>
         </div>
     </div>
</body>
<script src="../util/jquery-3.4.1.js"></script>
<script src="../util/bootstrap-3.3.7-dist/js/bootstrap.js"></script>
<!--<script src="../js/Class-data.js"></script>-->
<script src="../js/ClassInformation.js"></script>
</html>